import util from '@/util'

const theme_config = {
    dark: {
        head_theme: {
            color: "#373d41",
            textcolor: "#fff"
        },
        menu_theme: {
            color: "#333744",
            textcolor: "#fff",
            activecolor: "#409EFF",
        }
    },
    blue: {
        head_theme: {
            color: "rgb(45, 140, 240)",
            textcolor: "#fff"
        },
        menu_theme: {
            color: "#fff",
            textcolor: "#333744",
            activecolor: "rgb(45, 140, 240)",
        }
    },
    red: {
        head_theme: {
            color: "rgb(237, 64, 20)",
            textcolor: "#fff"
        },
        menu_theme: {
            color: "#fff",
            textcolor: "#333744",
            activecolor: "rgb(237, 64, 20)",
        }
    },
    orange: {
        head_theme: {
            color: "rgb(255, 153, 0)",
            textcolor: "#fff"
        },
        menu_theme: {
            color: "#fff",
            textcolor: "#333744",
            activecolor: "rgb(255, 153, 0)",
        }
    },
    pink: {
        head_theme: {
            color: "rgb(255, 192, 203)",
            textcolor: "#606266",
        },
        menu_theme: {
            color: "#fff",
            textcolor: "#333744",
            activecolor: "rgb(255, 192, 203)",
        }
    },
    green: {
        head_theme: {
            color: "rgb(25, 190, 107)",
            textcolor: "#fff",
        },
        menu_theme: {
            color: "#fff",
            textcolor: "#333744",
            activecolor: "rgb(25, 190, 107)",
        }
    }
}

const them = {
    state: {
        head_theme: util.getStore({ name: 'head_theme' }) || theme_config.blue.head_theme,
        menu_theme: util.getStore({ name: 'menu_theme' }) || theme_config.blue.menu_theme,
    },
    actions: {
    },
    mutations: {
        SET_THEME(state, theme_color) {
            state.head_theme = theme_config[theme_color].head_theme;
            state.menu_theme = theme_config[theme_color].menu_theme;
            util.setStore({ name: 'head_theme', content: theme_config[theme_color].head_theme });
            util.setStore({ name: 'menu_theme', content: theme_config[theme_color].menu_theme });
        }
    },
}
export default them